<template>
  <view>
    <view class="floor">
      <view class="title">
        <u-image
          :src="obj.floor_title.image_src"
          mode="widthFix"
          :lazy-load="true"
        ></u-image>
      </view>
      <view class="main">
        <navigator
          :url="item.navigator_url"
          redirect
          v-for="item in obj.product_list"
          :key="item.navigator_url"
        >
          <u-image
            mode="scaleToFill"
            :src="item.image_src"
            :lazy-load="true"
            width="100%"
            height="100%"
          ></u-image>
        </navigator>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  props: {
    obj: {
      type: Object,
      default: () => { }
    },
  },
}
</script>

<style scoped lang="scss">
.main {
  overflow: hidden;
  navigator {
    float: left;
    margin: 0 8rpx;
    &:first-child {
      width: 232rpx;
      height: 386rpx;
    }
    // 选择后几个选择器
    &:nth-last-child(-n + 4) {
      width: 233rpx;
      height: 188rpx;
    }
    &:nth-last-child(-n + 2) {
      margin-top: 10rpx;
    }
  }
}
</style>